<template>
  <div class="we">
    <yd-cell-group>
      <yd-cell-item>
        <span slot="left" class="ts">邮箱</span>
        <input
          slot="right"
          type="text"
          regex="email"
          v-model="request_data.email"
          placeholder="请输入分享达人昵称"
          style="text-align:right"
        />
      </yd-cell-item>
      <yd-cell-item>
        <span slot="left" class="ts">手机号</span>
        <input
          slot="right"
          type="text"
          regex="mobile"
          placeholder="请输入手机号"
          v-model="request_data.phone"
          style="text-align:right"
        />
      </yd-cell-item>
    </yd-cell-group>
    <yd-cell-group>
      <yd-cell-item>
        <span slot="left" class="ts">微信号</span>
        <input
          slot="right"
          type="text"
          placeholder="请输入微信号"
          v-model="request_data.wechat_code"
          style="text-align:right"
          @blur="blurin"
        />
      </yd-cell-item>
    </yd-cell-group>
    <yd-cell-group>
      <yd-cell-item>
        <span slot="left" class="ts">活动区域</span>
        <input
          slot="right"
          type="text"
          placeholder="请输入活动区域"
          v-model="request_data.area"
          style="text-align:right"
          @blur="blurin"
        />
      </yd-cell-item>
    </yd-cell-group>
    <yd-cell-group title="生活爱好">
      <yd-cell-item>
        <yd-textarea
          slot="right"
          placeholder="请输入您的生活爱好"
          v-model="request_data.hobby"
          maxlength="100"
          @focus="getFocus"
        ></yd-textarea>
      </yd-cell-item>
    </yd-cell-group>
    <div class="explain">
      <div class="ex">
        <span>申请说明</span>
      </div>
      <div>
        <span>
          分享达人即为本公司旗下app“嗨fun”的一个用户分享返佣金角色，注册成为分享达人审核通过后即为app的兼职营销人员，
          分享app内产品至自己的微信，QQ等社交软件内，用户通过分享达人的分享后消费，分享达人即可获得按公司统一（不低于15%）的分享达人返佣比例的佣金，
          可留在app内进行直接消费也可以提现至个人账户。
        </span>
      </div>
    </div>
    <div class="btn">
      <yd-button size="large" type="primary" @click.native="btn_data">提交申请</yd-button>
    </div>
  </div>
</template>
<script>
export default {
  name: "Applyfor",
  data() {
    return {
      request_data: {
        email: "102354125@qq.com",
        phone: '13645678855',
        wechat_code: "",
        area: "",
        hobby: ""
      }
    };
  },
  computed: {
    scrollHeight() {
      return document.documentElement.scrollTop || document.body.scrollTop || 0;
    }
  },
  methods: {
    blurin() {
      window.scrollTo(0, Math.max(this.scrollHeight - 1, 0));
    },
    getFocus() {
      $("input,textarea").on("blur", function() {
        window.scroll(0, 0);
      });
    },
    /*
     * 保存分享达人的数据
     * 作者：gzt
     * 时间：2019-11-29 15:18:14
     */
    btn_data() {
      let _this=this
      const regei = /^\w+\@+[0-9a-zA-Z]+\.(com|com.cn|edu|hk|cn|net)$/;
      const regph = /^1[345789]\d{9}$/;
      // 非空验证,正则
      // 邮箱
      if(this.request_data.email==''){
        this.$dialog.toast({
              mes: '邮箱不能为空',
              timeout: 1500,
              icon: 'error',
          });
             return false;
      }else{
          if(!(regei.test(this.request_data.email))){
          this.$dialog.toast({
                mes: '邮箱格式不正确',
                timeout: 1500,
                icon: 'error',
            });
             return false;
          }
      }
      // 手机号
      if(this.request_data.phone==''){
        this.$dialog.toast({
              mes: '手机号不能为空',
              timeout: 1500,
              icon: 'error',
          });
             return false;
      }else{
          if(!(regph.test(this.request_data.phone))){
          this.$dialog.toast({
                mes: '手机号格式不正确',
                timeout: 1500,
                icon: 'error',
            });
             return false;
          }
      }
      this.$post(this.$api.account.creat_eusersuper_Share,this.request_data)
      .then(res=>{
           if(res.success){
             _this.$dialog.toast({
                mes: '提交成功！',
                timeout: 1500,
                icon: 'success',
            });
           _this.$router.push('share_person')
           }else{
           _this.$dialog.toast({
                mes: '提交失败，请稍后再试！',
                timeout: 1500,
                icon: 'error',
            });
           }
      }).catch(res=>{
        this.$dialog.toast({
              mes: '系统异常！',
              timeout: 1500,
              icon: 'error',
          });
       });
     }
  }
};
</script>
<style scoped>

.ty {
  border-bottom: 1px solid #f5f5f5;
}
.ts {
  font-size: 0.3rem;
}
.btn {
  position: absolute;
  bottom: 0;
  height: 1.6rem;
  width: 100%;
  padding: 0.1rem 0.1rem;
}
.yd-btn-block {
  font-size: 0.35rem;
}
.explain {
  padding: 0.2rem 0.24rem;
  text-align: left;
  font-size: 0.28rem;
  margin-bottom: 1.5rem;
}
.ex {
  font-size: 0.32rem;
  font-weight: bold;
  padding-bottom: 0.2rem;
}
.explain span {
  line-height: 0.3rem;
  font-family: 微软雅黑;
}
</style>
